<?xml version="1.0" encoding="UTF-8"?>
<!--
To change this template, choose Tools | Templates
and open the template in the editor.
-->
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml"
      xmlns:p="http://primefaces.org/ui"
      xmlns:h="http://java.sun.com/jsf/html"
      xmlns:ui="http://java.sun.com/jsf/facelets"
      xmlns:f="http://java.sun.com/jsf/core">
    <f:view>
        <h:head>
            <title>similarity</title>
        </h:head>
        <h:body>
            <p:layout fullPage="true">

                <p:layoutUnit  position="north" size="120" resizable="true" closable="true" collapsible="true">
                    <p:graphicImage width="1265" height="100" url="./img/header_dataset.jpg" title="DATA SET SIMILARITY"></p:graphicImage>
                </p:layoutUnit>

                <p:layoutUnit position="south" size="50" closable="true" collapsible="true">
                    <h:link style="text-align: center" target="./index.xhtml" value="Data set similarity"/>
                </p:layoutUnit>

                <p:layoutUnit position="west" size="200"  header="Menu" collapsible="true" resizable="true">
                    <ui:include src="./component/menuUser.xhtml"></ui:include>                   
                </p:layoutUnit>

                <p:layoutUnit position="center">
                    
                    <h:form id="form">  
                        <p:dataTable id="simil" var="datasetdt" value="#{mbdataset.allDatasets}" selectionMode="multiple" selection="#{mbsimilarity.dss}" rowKey="#{datasetdt.dataSetID}">
                                   <!-->  scrollRows="10" scrollable="true" resizableColumns="true" scrollHeight="400" scrollWidth="400">  <-->
                            <p:column headerText="Data set ID" resizable="true">  
                                <h:outputText value="#{datasetdt.dataSetID}" />  
                            </p:column>  

                            <p:column headerText="Title" >  
                                <h:outputText value="#{datasetdt.title}" />  
                            </p:column>  

                            <p:column headerText="Description">  
                                <h:outputText value="#{datasetdt.dsDescription}" />  
                            </p:column>  

                        </p:dataTable>  

                        <h:panelGrid id="calcsimilarity" columns="2" cellpadding="5">  

                            <h:outputLabel value="Choose similarity measure:" style="font-weight:bold"/>

                            <p:selectOneMenu value="#{mbsimilarity.similaritymeasure}">  
                                <f:selectItem itemLabel="CalculateCosineSimilarity" itemValue="1" />  
                                <f:selectItem itemLabel="CalculateEuclidianSimilarity" itemValue="2" />  
                            </p:selectOneMenu>  

                            <p:commandButton value="Calculate similarity"  icon="ui-icon-search"  
                                             update=":form:display" oncomplete="simDialog.show()"/>  


                        </h:panelGrid>

                        <p:dialog header="Calculated similarity" widgetVar="simDialog"  
                                   showEffect="explode" hideEffect="explode">  
                            <h:panelGrid id="display" columns="2" cellpadding="2">
                                <h:outputLabel value="Measured #{mbsimilarity.measure()} similarity is:"/>
                                <h:outputText value="#{mbsimilarity.calculateSimilarityMeasure()}" style="font-weight:bold"/>
                            </h:panelGrid>>
                        </p:dialog> 

                    </h:form>  
                </p:layoutUnit>

            </p:layout>

        </h:body>
    </f:view>
</html>
